import {Component} from 'react'
import './login.css'
import Logo from '../img/2.png'
import axios from 'axios'
import qs from 'qs'
import {inject,observer} from "mobx-react";
import {message} from "antd";
@inject('login')
@observer
class Login extends Component{
    constructor(props) {
        super(props);
        this.state ={username:'',password:'',isLogin:'false'}
        this.showzhuce = this.showzhuce.bind(this);
        this.login =this.login.bind(this)
        this.username2 = this.username2.bind(this)
        this.pwd1 =this.pwd1.bind(this)
    }
    showzhuce(){
        this.props.history.push('/zhuce')
    }
    username2(e){
        this.setState({
            username:e.target.value
        })
    }
    pwd1(e){
        this.setState({
            password:e.target.value
        })
    }
    login(){
        if (this.state.username ===''|| this.state.password ===''){
            alert('用户名或者密码不能为空')
        }else {
             axios.post('/api/admin/login/do',qs.stringify({
                 adminName:this.state.username,
                 adminPwd:this.state.password
             }),{
                 headers:{
                     'Content-Type':'application/x-www-form-urlencoded'
                 }
             }).then(res=>{
                 if (res.data.status===200||res.data.msg ==='用户密码错误'){
                     alert(res.data.msg)
                 }else if (res.data.status===200||res.data.msg ==='该用户不存在'){
                     alert(res.data.msg)
                 }else {
                     let menus =res.data.data.menus
                     let token =res.data.data.token
                     let isLogin = 'ture'
                     this.props.login.Login(this.state.username,menus,isLogin,token)
                     this.props.history.push('/index')
                 }
             })
        }
    }
    render() {
        return (
            <div className='bj'>
              <div className='denglukuang'>
                <div className='biaoti'>
                 <img src={Logo} alt='我们的logo' className='logo1'/>
                 <h1 className='biaotizi'>乌衣巷后台管理</h1>
                </div>
                  <div className='shurukuang'>
                     <input type='text' placeholder='请输入用户名' className='username2' onChange={this.username2}/>
                      <input type='password' placeholder='请输入密码' className='pwd2' onChange={this.pwd1}/>
                      <input type='checkbox' className='jizhu'/><span className='jizhuwen'>记住密码</span>
                  </div>
                  <div className='anniu2'>
                    <button className='login' onClick={this.login}>登录</button>
                      <button className='zhuce1' onClick={this.showzhuce}>注册</button>
                  </div>
              </div>
            </div>
        )
    }
}
export {Login as default}